<!DOCTYPE html>
<html lang="en">
<head>
    <title>选房信息公示</title>
    <meta charset="utf-8">
    <link href="/plugins/echarts/common.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/style/admin.css" media="all">
    <link rel="stylesheet" href="/style/jmdf.css" media="all">
    <#setting number_format="#.##">
</head>
<body>
<!--顶部-->
<header class="headerTv left">
    <div class="left nav">
        <ul>
            <li>&nbsp;</li>
        </ul>
    </div>
    <div class="header_center left" style="position:relative;font-weight: bold;font-size: 36px;">
        英林镇英林村安置区北区地块公示
    </div>
    <div style="text-align: center">
        <span class="header_center" id="now" style="font-size: 22px;"></span><br/>
        <span class="header_center" id="nowHour" style="font-size: 22px;"></span>
    </div>
</header>
<div class="con left">
    <div class="div_any">
        <div class="left div_any01" style="width:98%;">
            <div class="div_any_child">
                <div class="div_any_title" id="timeStr" style="font-size: 25px;">
                </div>
                <div class="table_p" style="margin-top: 20px;height: 1280px;">
                    <table>
                        <thead>
                        <tr>
                            <th style="width: 5%;font-size: 18px;color: #ffffff;">序号</th>
                            <th style="width: 20%;font-size: 18px;color: #ffffff;">被征收人</th>
                            <th style="width: 10%;font-size: 18px;color: #ffffff;">选房号</th>
                            <th style="width: 45%;font-size: 18px;color: #ffffff;">选房信息</th>
                            <th style="width: 20%;font-size: 18px;color: #ffffff;">车位信息、店面信息</th>
                        </tr>
                        </thead>
                        <tbody style="font-size: 18px;"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="/layui/layui.js" charset="utf-8"></script>
<script src="/plugins/jquery/jquery.min.js"></script>
<script src="/plugins/echarts/echarts.min.js"></script>
<script>
    layui.config({
        base: '/modules/' //静态资源所在路径
    }).use(['jquery'], function () {
        var $ = layui.jquery;
        var pageSize = 20;
        var pageNo = 1;
        var totalCount = 0;
        var totalCountNew = 0;
        function getChooseHouseInfo() {
            $.ajax({
                url: "/showForHQ_Plot_C_two/getChooseHouseInfo?pageSize=" + pageSize + "&pageNo=" + pageNo,
                type: "get",
                dataType: "json",
                success: function (data) {
                    timeStr = data.timeStr;
                    $("#timeStr").html(timeStr);
                    var table = $("table").find("tbody");
                    table.html("");
                    totalCountNew = data.totalCount;
                    if (totalCount != 0 && totalCount != totalCountNew) {
                        pageNo = 1;
                    }
                    totalCount = totalCountNew;
                    var totalPageNo = parseInt(Math.ceil(totalCount / pageSize));
                    pageNo++;
                    if (pageNo > totalPageNo) {
                        pageNo = 1;
                    }

                    var dataLists = data.dataLists;
                    var len = dataLists.length;
                    var num = len + 1;
                    for (key in dataLists) {
                        num = num - 1;
                        var obj = dataLists[key];
                        var houseStrInfo = obj.houseStrInfo;
                        houseStrInfo = houseStrInfo.substring(0, houseStrInfo.length - 1);
                        var carLotStrInfo = obj.carLotStrInfo;
                        carLotStrInfo = carLotStrInfo.substring(0, carLotStrInfo.length - 1);
                        var storageRoomStrInfo = obj.storageRoomStrInfo;
                        storageRoomStrInfo = storageRoomStrInfo.substring(0, storageRoomStrInfo.length - 1);
                        var shopHouseStrInfo = obj.shopHouseStrInfo;
                        shopHouseStrInfo = shopHouseStrInfo.substring(0, shopHouseStrInfo.length - 1);
                        if (carLotStrInfo.length > 0 && shopHouseStrInfo.length > 0) {
                            carLotStrInfo = carLotStrInfo + ",";
                        }
                        var tr = $("<tr></tr>");
                        tr.append($("<td></td>").html(num));
                        tr.append($("<td></td>").html(obj.name));
                        tr.append($("<td></td>").html(obj.chooseHouseNum));
                        tr.append($("<td></td>").html(houseStrInfo));
                        tr.append($("<td></td>").html(carLotStrInfo + storageRoomStrInfo + shopHouseStrInfo));
                        table.append(tr);
                    }
                    for (var i = 1, j = pageSize - len; i <= j; i++) {
                        var tr = $("<tr></tr>");
                        tr.append($("<td></td>").html("&nbsp;"));
                        tr.append($("<td></td>").html("&nbsp;"));
                        tr.append($("<td></td>").html("&nbsp;"));
                        tr.append($("<td></td>").html("&nbsp;"));
                        tr.append($("<td></td>").html("&nbsp;"));
                        table.append(tr);
                    }
                }
            });
        }

        getChooseHouseInfo();
        setInterval(getChooseHouseInfo, 40000);

        function formatDate(now) {
            var year = now.getFullYear();
            var month = now.getMonth() + 1;
            var date = now.getDate();
            var hour = now.getHours();
            var minute = now.getMinutes();
            var second = now.getSeconds();
            return year + "年" + month + "月" + date + "日";
        }

        function formatDateHour(now) {
            var year = now.getFullYear();
            var month = now.getMonth() + 1;
            var date = now.getDate();
            var hour = now.getHours();
            var minute = now.getMinutes();
            var second = now.getSeconds();
            return hour + "时" + minute + "分" + second + "秒";
        }

        function refreshDate() {
            var now = formatDate(new Date()).toString();
            var nowHour = formatDateHour(new Date()).toString();
            $("#now").text(now);
            $("#nowHour").text(nowHour);
        }

        setInterval(refreshDate, 1000);
    });
</script>
</body>
</html>
